import { ref, watch } from 'vue';
// import { rndNum } from '@/util/rnd.js';

export const trfNewline = R.pipe(
  R.split('<br/>'),
  R.map( R.reduce((ret, s) => ret + `<span>${ s }</span>`, '') ),
  R.join('<span>&#10;</span>')
);

export const taskInfo = ref(null);
export const classes = ref([]);
export const labelColorMap = ref(() => {});

export function initColorMap() {
  const RndColor = () => `rgb(${ rndNum({ max: 256 }) },${ rndNum({ max: 256 }) },${ rndNum({ max: 256 }) })`;
  classes.value = taskInfo.value.labels.split(',');
  labelColorMap.value = classes.value.reduce((map, label) => Object.assign(map, { [label]: RndColor() }), {});
}

export const layerMode = ref('switch');
export const editingLabelLayer = ref(null);

export const editingLayers = ref([]);
watch(
  () => editingLayers.value,
  (newVal, oldVal) => {
    editingLabelLayer.value = null;
    selectedLayers.value = newVal;
  },
  { deep: true }
);

export const selectedLayers = ref([]);

export const keydownCondPairs = [];
export const pointerDownMap = {};

export const reasonList = ref(['漏标', '错标', '多标']);

/** @type {import('vue').Ref<'none' | 'comment'>} */
export const using = ref('none');
